Programmation Client II

Rappel

Types et opérateurs de bases

Déclarer, initialiser des valeurs

// For values that change
let name = "didier";
name = "paulette";


// For values that never change
const age = 37;

Les types de bases

nom	exemple	description
boolean	true/false	Représente un valeur vraie ou fausse
number	12, 0, -19, 3.14159	Représente un nombre quelconque
String	"Bonjour", 'les amis'	Représente du texte
undefined	undefined	Représente un inconnue provenant de javascript
null	null	Représente un inconnue provenant du programmeur

Égalité entre valeurs

Pour que deux variables soient === il faut que les deux variables aillent le même type et la même valeur.

let message1 = "Bonjour le monde"

let message2 = "привет мир";
let message1EqualsMessage2 = (message1 === message2); // false

Les opérations sur les booléen

Définition	Opérateur	Exemple
Égalité entre deux boolean	===	true === true
et logique	&&	true && true
ou logique	||	true || false
Négatif	!	!false

Opérations sur les nombres

Définition	Opérateur	Exemple
Égalité entre deux nombres	===	10 === 10
Somme	+	2 + 2 === 4
Produit	*	3 * 4 === 12
Division	/	12 / 3 === 12
Modulo	%	7 % 3 === 1

Les comparaison de nombres

Définition	Opérateur	Exemple
Égalité entre deux nombres	===	2 + 2 === 4
Strictement plus petit	<	2 < 4
Plus petit (ou égale)	<=	4 <= 4
Strictement plus grand	>	4 > 2
Plus grand (ou égale)	>=	4 >= 4

Opérations sur les strings

Définition	Opérateur	Exemple
Égalité entre deux strings	===	"Japon" === "Japon"
concaténation	+	"Bonjour " + "le monde" === "Bonjour le monde"

Méthodes courantes sur les strings

Définition	Méthode	Exemple	Notes
Nombre de lettres dans la string	.length	"Japon".length === 5	plein de bug pour les gens qui écrivent dans des langues bizzards*
Mettre en lettre majuscule	.toUpperCase()	"Japon".toUpperCase() === "JAPON"
Mettre en lettre minuscule	.toLowerCase()	"Japon".toLowerCase() === "japon"
Lettre à une position précise	.charAt()	"Japon".charAt(3) === "o"	plein de bug pour les gens qui écrivent dans des langues bizzards*

langues bizzards: surtout les emoji. Même le chinois langues bizzards m'a l'air de fonctionnner

Conditions

Le ifs

if(age > 18){
    alert("the user is major");
} else {
    alert("the user is minor");
}

Condition multiple

if(age > 21){
    alert("the user is major in the US.");
} else if (age > 18) {
    alert("the user is major in real countries but not in the empire.");
}else {
    alert("the user is minor.");
}

Condition sans else

if(age > 18){
    alert("the user is major");
}

• On beaucoup aime les if sans else

• On aime les if avec else

• On tollère les if avec des else if

La syntaxe

if(la condition){
    // quoi faire si la condition est vraie
} else {
    // quoi faire si la condition est fausse
}

La condition

• Devrait être un boolean mais pas nécessairement...

Toutes valeurs sauf les valeurs si bas sont considérées comme vraies.

• null, la valeur null
• undefined, la valeur undefined
• false, la faux
• NaN, not a number (exemple parseInt("sdjkds"))
• 0, zero
• "", le string vide

https://developer.mozilla.org/en-US/docs/Glossary/Falsy

Exemples 1

let name = "";
if(!name){
    name = "no name";
}
console.log(name);

Exemples 2

let name;
if(!name){
    name = "no name";
}
console.log(name);

Exemples 2

let name = null;
if(!name){
    name = "no name";
}
console.log(name);

Exemples 3

let person = {};
if(!person.name){
    person.name = "";
}
console.log(person);

Exemples 4

let persons = [];
if(!persons.length){
    persons.push({name: "didier"});
}
console.log(persons);

functions

Définition fonction

D'un point de vue impératif

Une fonction est un bout de code nommé que nous pouvons appelé. Les vieux de la vieille apelle cela une "(sub)routine"

// un bout de code nommé sayHello qui dit "Hello World!"
function sayHello(){
    alert("hello world");
}

Définition mathématique

D'un point de vue impératif

En mathématiques, une fonction est un type de relation $f$ entre deux variables. On appelle cette relation une fonction lorsque chaque valeur de la variable indépendante est associée à une et une seule valeur de la variable dépendante.

-- https://www.alloprof.qc.ca/fr/eleves/bv/mathematiques/relations-et-fonctions-m1095

syntaxe fonctions

function sayHello(){
    alert("hello world");
}

function addNumber(a, b){
    return a + b;
}

function isMajorMessage(age){
    if(age < 18){
        return "user is minor";
    }
    if(age < 21){
        return "user is minor in crazy countries";
    }
    return "user is major"
}

Syntaxe

Notes sur les fonctions

Les arguments d'une fonction sont connue de la fonction seulement.

Les deux fonctions ci-bas sont les mêmes

function add(a, b){
    return a + b;
}

function add(x, y){
    return x + y;
}

Nom d'une fonction

• Le nom d'une fonction doit être unique

• Le nom de la fonction devrait être un verbe

• Moins que la fonction est utilisé de fois, plus son nom devrait être long

function add2AndMultiplyBy3(a){
    return (a + 2) * 3;
}

Retourner une valeur d'une fonction

• Une fonction peut retourner au maximum une seule valeure

• À l'instant que la fonction retourne, l'execution de la fonction se termine

function getMinorityStatus(age){
    if(age < 18){
        return "minor";
    }
    if(age < 21){
        return "minor in the empire";
    }
    return "major";

}

console.log(getMinorityStatus(12)); // "minor"
console.log(getMinorityStatus(19)); // "minor in the empire"
console.log(getMinorityStatus(87)); // "major"

Appeler une fonction

On utilise la notation nomDeLaFonction(argument1, argument2)

function add(a, b){
    return a + b;
}

function multiply(a, b){
    return a * b;
}

console.log(add(2, 3));
console.log(add(2, multiply(4, 5)));
let x = multiply(2, 3);
console.log(add(2, x));
console.log(
    add(8, 
        multiply(10, 6))
);

Listes et boucles

Boucle for classique

for(let i = 0; i < 10; i ++){
    console.log(i);
}

1. inititalilation : let i = 0
2. condition : i < 10
3. incrémentation: i = i + 1

Créer une liste.

let emptyList = [];

let beerList = ["bud weiser", "ipa du nord-est", "headdy topper"];

let grades = [90, 65, 40, 55];

Opération sur les listes

let beerList = ["bud weiser", "ipa du nord-est", "headdy topper"];

//  longeur d'une liste
console.log(beerList.length);

// ajouter un élément à une liste
beerList.push("peche mortel");

// element d'une liste
// l'indice commence par 0!!!!!!!!!
alert(beerList[2]); // "headdy topper"

Boucle for each

(on aime beaucoup les boucles for each)

for(const beer of beerList){
    console.log(beer);
}

Objets

Object javascript

• Un objet javascript est une collection clé/valeur

• Les clés sont des strings

• En d'autres languages

  • Dictionnaire
  • Map
  • HashMap

Rien de mieux qu'un exemple

let beer = {
    nom: "Péché Mortel",
    brasserie: "Dieu du Ciel!",
    quantity: 350,
    prix: 5.99,
}

L'object vide!

{}

Méthodes sur objet

let beer = {
    nom: "Péché Mortel",
    brasserie: "Dieu du Ciel!",
    quantity: 350,
    prix: 5.99,
}

// Prendre une valeur par une variable
console.log(beer.name)

// associer une nouvelle valeur
beer.nom = "grande noirceur";

// Prendre toutes les clés
Object.keys(beer);

Looper sur tous les items d'un objet

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys

let beer = {
    nom: "Péché Mortel",
    brasserie: "Dieu du Ciel!",
    quantity: 350,
    prix: 5.99,
}

for(let key of Object.keys(beer)){
    let value = beer[key];
    console.log(key + " : " + value);
}

Exercice Récapitulatif

Faisons la question 6.o. de https://didier-ahuntsic.gitlab.io/cours-420-298-ah/_exercices/007.pdf

Pour ce faire, nous allons procéder ainsi:

1. faire un plan

2. suivre le plan